<template>
	<view class="address-container page-container">

		<!-- 地址列表 -->
		<view class="address-list" v-if="addressList.length > 0">
			<view class="address-item" v-for="(item, index) in addressList" :key="index">
				<view class="address-content" @click="selectAddress(item)">
					<view class="address-header">
						<view class="address-info">
							<text class="receiver-name">{{ item.realname }}</text>
							<text
								class="receiver-phone">{{ $tools.hidePhoneNumber($secret.decryptAES(item.mobile)) }}</text>
						</view>
						<view class="address-tags">
							<text class="default-tag" v-if="item.is_default===1">默认</text>
							<text class="home-tag" v-if="item.tag_name === 'home'">家</text>
							<text class="company-tag" v-else-if="item.tag_name === 'company'">公司</text>
							<text class="company-tag" v-else-if="item.tag_name === 'school'">学校</text>
							<text class="company-tag" v-else-if="item.tag_name === 'other'">其他</text>
						</view>
					</view>
					<text
						class="address-detail">{{ item.province.name+' '+item.city.name+' '+item.town.name+' '+$secret.decryptAES(item.address) }}</text>
				</view>
				<view class="address-actions">
					<view class="action-item" @click.stop="editAddress(item)">
						<u-icon name="edit-pen" size="20" color="#666"></u-icon>
						<text class="action-text">编辑</text>
					</view>
					<view class="action-item" @click.stop="deleteAddress(item, index)">
						<u-icon name="trash" size="20" color="#666"></u-icon>
						<text class="action-text">删除</text>
					</view>
				</view>
			</view>
		</view>

		<!-- 空状态 -->
		<view class="empty-state" v-else>
			<image src="@/static/images/cart-green.png" mode="aspectFit" class="empty-image">
			</image>
			<text class="empty-text">暂无收货地址</text>
			<button class="add-address-btn" @click="addAddress">添加地址</button>
		</view>

		<!-- 添加地址按钮 -->
		<view class="add-button" v-if="addressList.length > 0">
			<button class="add-btn" @click="addAddress">新增收货地址</button>
		</view>

		<!-- 地址使用说明 -->
		<!-- <view class="tips-section" v-if="addressList.length > 0">
			<view class="tips-title">
				<u-icon name="info-circle" size="16" color="#999"></u-icon>
				<text class="tips-text">温馨提示</text>
			</view>
			<view class="tips-content">
				<text class="tip-item">• 最多可添加20个收货地址</text>
				<text class="tip-item">• 默认地址将优先显示在下单页面</text>
				<text class="tip-item">• 请确保地址信息准确，以免影响收货</text>
			</view>
		</view> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isSelectMode: false, // 是否为选择地址模式
				hasSearched: false,
				recordCount: 0,
				page: 1,
				limit: 10,
				addressList: []
			}
		},
		onLoad(options) {
			// 如果是选择地址模式
			if (options.type === 'select') {
				this.isSelectMode = true
			}
			this.onSearch();
		},
		/**
		 * 页面相关事件处理函数--监听用户下拉动作
		 */
		onPullDownRefresh() {
			if (!this.hasSearched) {
				this.page = 1
				this.recordCount = 0
				this.addressList = []
				this.loadDataList()
			}
		},

		/**
		 * 页面上拉触底事件的处理函数
		 */
		onReachBottom() {
			// 下拉触底，先判断是否有请求正在进行中
			// 以及检查当前请求页数是不是小于数据总页数，如符合条件，则发送请求
			const page = this.page
			const limit = this.limit
			const recordCount = this.recordCount
			if (!this.hasSearched && page * limit < recordCount) {
				this.page++
				setTimeout(() => {
					this.loadDataList()
				}, 500)
			}
		},
		methods: {
			// 重新重新事件
			onSearch() {
				this.page = 1
				this.recordCount = 0
				this.addressList = []
				this.loadDataList()
			},
			loadDataList() {
				// 加载用户收货地址
				if (this.hasSearched) {
					return false
				}

				this.hasSearched = true
				this.$api.user.GetAddressList({
					page: this.page,
					limit: this.limit,
				}).then(res => {
					this.hasSearched = false
					this.recordCount = res.count
					res.data.forEach(item => {
						item.province = this.$tools.parseJsonObject(item.province)
						item.city = this.$tools.parseJsonObject(item.city)
						item.town = this.$tools.parseJsonObject(item.town)
						item.street = this.$tools.parseJsonObject(item.street)
					})
					this.addressList = this.addressList.concat(res.data)
				}).catch(err => {
					this.hasSearched = false
					if (this.page > 0) {
						this.page--
					}
				})
			},
			// 选择地址
			selectAddress(item) {
				if (this.isSelectMode) {
					// 选择模式下，返回选中的地址
					console.log('返回选中的地址', item.mobile)
					item.mobile = this.$secret.decryptAES(item.mobile)
					item.address = this.$secret.decryptAES(item.address)
					const pages = getCurrentPages()
					const prevPage = pages[pages.length - 2]
					if (prevPage) {
						prevPage.$vm.selectAddressEvent(item)
					}
					setTimeout(() => {
						uni.navigateBack()
					}, 50)
				} else {
					// 正常模式下，可以设置为默认地址
					this.setDefaultAddress(item)
				}
			},

			// 设置默认地址
			setDefaultAddress(address) {
				if (address.is_default === 1) return

				uni.showModal({
					title: '设置默认地址',
					content: '确定将此地址设为默认收货地址吗？',
					success: (res) => {
						if (res.confirm) {
							this.$api.user.SetDefaultAddress({
								id: address.id
							}).then(res => {
								// 取消其他地址的默认状态
								this.addressList.forEach(item => {
									item.is_default = 0
								})
								// 设置当前地址为默认
								address.is_default = 1

								uni.showToast({
									title: res.msg,
									icon: 'success'
								})
							})
						}
					}
				})
			},

			// 添加地址
			addAddress() {
				uni.navigateTo({
					url: '/pages/user/address-edit'
				})
			},

			// 编辑地址
			editAddress(address) {
				uni.navigateTo({
					url: `/pages/user/address-edit?id=${address.id}`
				})
			},

			// 删除地址
			deleteAddress(address, index) {
				uni.showModal({
					title: '删除地址',
					content: '确定要删除这个收货地址吗？',
					success: (res) => {
						if (res.confirm) {
							this.$api.user.DelAddress({
								id: address.id
							}).then(res => {
								this.addressList.splice(index, 1)

								// 如果删除的是默认地址，且还有其他地址，则设置第一个为默认
								if (address.is_default === 1 && this.addressList.length > 0) {
									this.setDefaultAddress(this.addressList[0])
								}

								uni.showToast({
									title: '删除成功',
									icon: 'success'
								})
							})
						}
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.address-container {
		background-color: #f5f5f5;
		min-height: 100vh;
		padding-bottom: calc(180rpx + env(safe-area-inset-bottom));
	}

	.address-list {
		padding: 20rpx;
	}

	.address-item {
		background-color: #ffffff;
		border-radius: 12rpx;
		padding: 30rpx;
		margin-bottom: 20rpx;
		position: relative;
		box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.08);
	}

	.address-content {
		margin-bottom: 30rpx;
	}

	.address-header {
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		margin-bottom: 20rpx;
	}

	.address-info {
		display: flex;
		align-items: center;
	}

	.receiver-name {
		font-size: 32rpx;
		font-weight: bold;
		color: #333;
		margin-right: 20rpx;
	}

	.receiver-phone {
		font-size: 28rpx;
		color: #666;
	}

	.address-tags {
		display: flex;
		align-items: center;
	}

	.default-tag,
	.home-tag,
	.company-tag {
		font-size: 20rpx;
		padding: 6rpx 12rpx;
		border-radius: 12rpx;
		margin-left: 12rpx;
	}

	.default-tag {
		background-color: #52a58a;
		color: #ffffff;
	}

	.home-tag {
		background-color: #52a58a;
		color: #ffffff;
	}

	.company-tag {
		background-color: #52a58a;
		color: #ffffff;
	}

	.address-detail {
		font-size: 28rpx;
		color: #666;
		line-height: 1.5;
	}

	.address-actions {
		display: flex;
		justify-content: flex-end;
	}

	.action-item {
		display: flex;
		flex-direction: column;
		align-items: center;
		margin-left: 40rpx;
	}

	.action-text {
		font-size: 22rpx;
		color: #666;
		margin-top: 8rpx;
	}

	.empty-state {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		padding: 120rpx 40rpx;
		text-align: center;
	}

	.empty-image {
		width: 200rpx;
		height: 200rpx;
		margin-bottom: 30rpx;
	}

	.empty-text {
		font-size: 30rpx;
		color: #333;
		margin-bottom: 60rpx;
		font-weight: 500;
	}

	.add-address-btn {
		background-color: #52a58a;
		color: #ffffff;
		border: none;
		border-radius: 40rpx;
		padding: 20rpx 60rpx;
		font-size: 28rpx;
		font-weight: 500;
	}

	.add-button {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		background-color: #ffffff;
		border-top: 1rpx solid #eee;
		padding: 20rpx 30rpx;
		padding-bottom: calc(20rpx + env(safe-area-inset-bottom));
	}

	.add-btn {
		width: 100%;
		background-color: #52a58a;
		color: #ffffff;
		border: none;
		border-radius: 12rpx;
		padding: 0 24rpx;
		font-size: 32rpx;
		font-weight: 500;
	}

	.tips-section {
		background-color: #ffffff;
		margin: 20rpx;
		border-radius: 16rpx;
		padding: 40rpx;
	}

	.tips-title {
		display: flex;
		align-items: center;
		margin-bottom: 20rpx;
	}

	.tips-text {
		font-size: 28rpx;
		color: #666;
		margin-left: 12rpx;
	}

	.tips-content {
		padding-left: 28rpx;
	}

	.tip-item {
		font-size: 26rpx;
		color: #999;
		line-height: 1.6;
		margin-bottom: 8rpx;
		display: block;
	}

	.tip-item:last-child {
		margin-bottom: 0;
	}
</style>